import React from 'react'
import { Form, Input,Icon,Col, Button, message } from 'antd'

const FormItem = Form.Item

//引入标准Fetch及IE兼容依赖
import 'whatwg-fetch';
import  config from '../assets/config.js';
class myForm extends React.Component {
    constructor(props) {
        super(props)

    }

 	handleSubmit=(e) => {
    e.preventDefault();
    this.props.form.validateFields((errors, values) => {
      if (!!errors) {
        console.log('Errors in form!!!');
        return;
      }
      const data=this.props.form.getFieldsValue();
       if(data.username==='admin'&&data.passwd==='admin'){

        	window.location.hash = '/'
        }else{
        	message.success('帐号或者密码错误!')
        }
        this.props.form.resetFields()
    });
  }

    render() {
        const { getFieldProps, getFieldError, isFieldValidating } = this.props.form;
        const formItemLayout = {
            labelCol: { span: 6 },
            wrapperCol: { span: 24 }
        }
        const userProps = getFieldProps('username', {
	      rules: [
	        { required: true, message: '请填写用户名' },
	      ],trigger: ['onBlur', 'onChange'],
	    });
        const passwdProps = getFieldProps('passwd', {
	      rules: [
	        { required: true, message: '请填写密码' },
	      ],trigger: ['onBlur', 'onChange'],
	    });
	    const passwdProps2 = getFieldProps('passwd2', {
	      rules: [
	        { required: true, message: '请确认密码' },
	      ],trigger: ['onBlur', 'onChange'],
	    });
        return (
        	<div className="loginbg">
        	<div className="loginBox  sign">
        	<img src='src/assets/images/logo.png' width="50" id="logo"/>
            <Form horizontal onSubmit={this.handleSubmit} >
               	<FormItem

                    {...formItemLayout}
                    hasFeedback

                    >
			            <Input {...userProps} addonBefore={<Icon type="user" />} placeholder="用户名"   />
                </FormItem>

                <FormItem

                    {...formItemLayout}
                    hasFeedback
                    >
			            <Input {...passwdProps} addonBefore={<Icon type="lock" />} placeholder="密码"  type="password"  />
                </FormItem>

                <FormItem

                    {...formItemLayout}
                    hasFeedback
                    >
			            <Input {...passwdProps2} addonBefore={<Icon type="lock" />} placeholder="确认密码"  type="password"  />
                </FormItem>

                <FormItem  style={{ marginTop: 24 }}>
                    <Button  type="primary" htmlType="submit" className="login-form-button">
		           		注册
		          	</Button>
                </FormItem>

            </Form>
            </div>
            </div>
        )
    }
}

myForm = Form.create()(myForm)

export default myForm